<template>
  <el-container>
    <el-aside style="overflow: hidden; min-height: 93vh; width: 200px; background-color: #545c64;">
      <el-menu
          :default-active="$route.path" router="true"
          class="el-menu-service"
          @open="handleOpen"
          @close="handleClose"
          background-color="#545c64"
          text-color="#fff"
          active-text-color="#ffd04b">

        <el-menu-item index="/selfinfoview">
          <i class="el-icon-user"></i>
          <span slot="title">基本信息</span>
        </el-menu-item>

        <el-menu-item index="/selfcollectview">
          <i class="el-icon-goods"></i>
          <span slot="title">我的收藏</span>
        </el-menu-item>

        <el-menu-item index="/selforder">
          <i class="el-icon-s-order"></i>
          <span slot="title">我的订单</span>
        </el-menu-item>

        <el-menu-item index="/selffeedbackview">
          <i class="el-icon-notebook-1"></i>
          <span slot="title">我的反馈</span>
        </el-menu-item>

        <el-submenu index="2">
          <template slot="title">
            <i class="el-icon-service"></i>
            <span>售后服务</span>
          </template>

          <el-menu-item index="/shopperservice">
            <i class="el-icon-service"></i>
            <span>商家服务评分</span>
          </el-menu-item>

          <el-menu-item index="/recommenduploadtree">
            <i class="el-icon-service"></i>
            <span>推荐商家上架</span>
          </el-menu-item>

        </el-submenu>

      </el-menu>
    </el-aside>

    <el-main>
      <router-view></router-view>
    </el-main>

  </el-container>
</template>

<script>
export default {
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    }
  }
}
</script>

<style>

* {
  box-sizing: border-box;
}

.el-menu-service{
  border-right:none !important;
}

</style>